/**
 * Copyright 2016 Google Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

$closeSize : 25px;

@define-mixin closeButton {
	position: absolute;
	top: 20px;
	right: 20px;
	width: $closeSize;
	height: $closeSize;
	background-image: url(../images/x_button.png);
    background-size: 100% 100%;
	color: white;
	pointer-events: none;
	opacity: 0;
	cursor: pointer;
	z-index: 100001;
	transition: transform 0.2s;
	-webkit-tap-highlight-color: rgba(0,0,0,0);

	&.visible {
		opacity: 1;
		pointer-events: initial;

		&:hover {
			transform: scale(1.1);

			&:active {
				opacity: 0.4;
			}
		}

	}
}

@define-mixin yellowLink {
	color: rgb(251, 240, 57);
    text-decoration: underline;
    cursor: pointer;
}